<template>
  <div id="detail_goods_info">
    <div class="goods_info_title">
      商品详情
    </div>
    <div class="goods_info_introduce">
      {{infos.desc}}
    </div>

    <div class="goods_info_img" v-for="(item,index) in  infos" :key="index">
      <div class="goods_info_key">{{item.key}}</div>
      <img v-for="item2 in item.list" :key="item2" :src="item2"/>
    </div>
  </div>
</template>

<script>
export default {
  name: "DetailGoodsInfo",
  props: {
    infos: {
      type:Object,
      default(){
        return{}
      }
    }
  },
  data(){
    return {
    }
  },
  mounted() {
  }
}
</script>

<style scoped>
#detail_goods_info{
  position: relative;
  width: 100%;
  margin: 10px 0;
}
.goods_info_title,.goods_info_key{
  width: 100%;
  height: 40px;
  line-height: 35px;
  font-size: 19px;
  letter-spacing: 4px;
  padding-left: 40px;
  background-color: #00b3ee;
}
.goods_info_introduce{
  font-size: 17px;
  color: #aaaaaa;
  background: #FFFFFF;
}
.goods_info_img img{
  width: 100%;
}
</style>
